{% extends "GairalFrankCVBundle::layout.html.twig" %}

{% block bodyCV %}
<section id="education">

{% if listEducation %}
    {% for education in listEducation %}
    <div class="well well-large" itemscope itemtype="http://data-vocabulary.org/Organization">
        <div class="media"
             id="eduSkills_{{ education.id }}"
             data-content="
                 {% for skill in education.skills %}
             &lt;span class=&quot;label label-success&quot;&gt;{{ skill.name }}&lt;/span&gt;
                 {% endfor %}
             ">
            {% if education.image %}
            <img class="pull-left" src="{{ asset(education.image.webPath) }}" alt="{{ education.name }}"/>
            {% endif %}
            <div class="media-body">
                <h2 class="media-heading" itemprop="name">
                    <span>{{ education.name }}</span>
                    {% if education.shortDescription %}
                    <span> - {{ education.shortDescription }}</span>
                    {% endif %}
                </h2>
            </div>
            <span 
                class="label label-important">
                        {{ education.yearIn|date('Y') }}-{{ education.yearOut|date('Y') }} 
            </span>
            <span 
                class="label label-info" itemprop="locality">
                        {{ education.place }}
            </span>
            <a href="{{ education.website|raw }}" onclick="window.open('{{ education.website|raw }}/');
                    return false;" class="label label-info" itemprop="url">{{ education.website|raw }}</a>
        {% if education.diploma %}
               <p>{{ education.diploma }}</p>
        {% endif %}
            </div>

        {% if education.description %}
            <div class="alert alert-info">
                <span>Description: </span>
                            {{ education.description|raw }}
            </div>
        {% endif %}
        {% if education.extraInfo %}
            <div class="alert alert-info">
                <span>Extra-curiculars: </span>
                           {{ education.extraInfo|raw }}
            </div>
        {% endif %}
        </div>
    {% else %}
        no education
    {% endfor %}
{% endif %}
    </section>
{% endblock %}

{% block js %}
    <script type="application/javascript">
        $(function () { 
        {% for education in listEducation %}
            {% if education.skills|length > 0 %}
        $("#eduSkills_{{ education.id }}").popover({trigger: 'hover', html: true, placement: 'bottom'});
            {% endif %}
        {% endfor %}
        });
    </script> 
{% endblock %}